Skip to content

responsified! - #1

Merged
UrbaneD0ge merged 1 commit into
mainfrom
Mobile-responsive-tables
Jul 2, 2026
Merged

responsified!#1
UrbaneD0ge merged 1 commit into
mainfrom
Mobile-responsive-tables

Conversation

@UrbaneD0ge

Copy link
Copy Markdown
Owner

No description provided.

@UrbaneD0ge
UrbaneD0ge requested a review from Copilot July 2, 2026 20:32
@vercel

vercel Bot commented Jul 2, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
bpdb Ready Ready Preview, Comment Jul 2, 2026 8:33pm

@UrbaneD0ge
UrbaneD0ge merged commit 91281c4 into main Jul 2, 2026
4 checks passed

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR updates the user ratings page to be responsive by switching the ratings table layout based on viewport width (desktop vs mobile).

Changes:

  • Added a MediaQuery-driven large.current flag to conditionally render desktop vs mobile table structures.
  • Reworked table headers/cells to hide/show columns depending on screen size.
  • Adjusted table styling rules to better support smaller screens.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

import { MediaQuery } from 'svelte/reactivity';
import 'maplibre-gl/dist/maplibre-gl.css';

const large = new MediaQuery('min-width: 1024px');

Copy link
Copy Markdown
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If that were true it wouldn't work

Comment on lines +128 to +133
{#if !large.current}
<tr>
<td colspan="5">{rating?.notes || '-'}</td>
<td><form action="?/delete" method="POST" class="bg-transparent!"><input type="number" value={rating.rating_id} name='id' hidden><button class="p-2 bg-red-600 rounded-md cursor-pointer" type="submit">🗑️ </button></form></td>
</tr>
{/if}
<tbody>
<tr>
<td colspan="8"><i>No ratings yet.</i></td>
<td colspan={large.current ? 8 : 7}><i>No ratings yet.</i></td>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants